﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Tab.aspx.cs" Inherits="demo.Pages.Tab" %>

<%@ Register Assembly="Water" Namespace="Water.Web.Controls" TagPrefix="page" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <page:ObjectDataSource ID="ObjectDataSource1" runat="server" TypeName="demo.Objects.BLL.Tabs" CanSelect="true">
        </page:ObjectDataSource>
        <fieldset>
            <legend>Tab</legend>
            <ul>
                <li>简单易用</li>
                <li>支持数据绑定</li>
                <li>支持数据绑定和非数据绑定在同是存在</li>
                <li>支持tab也是有有效控制</li>
                <li>支持tab标题方向切换(左/右)</li>
                <li>支持tab页内容多种导航方式(Iframe/Ajax/Contain)</li>
            </ul>
        </fieldset>
        <br />
        <page:TabControl ID="TabControl1" runat="server" TitleText="非数据绑定tabs信息">
            <Tabs>
                <page:TabPage ID="TabPage1" Title="个人信息" TitleImageUrl="../images/user1.gif" runat="server">
                    <asp:BulletedList ID="BulletedList1" runat="server" BulletStyle="Numbered">
                        <asp:ListItem Text="刘国强" Value="father"></asp:ListItem>
                        <asp:ListItem Text="郭丽君" Value="mother"></asp:ListItem>
                        <asp:ListItem Text="刘欣懿" Value="daughter"></asp:ListItem>
                    </asp:BulletedList>
                </page:TabPage>
                <page:TabPage ID="TabPage2" Title="档案信息" runat="server" Selected="true">
                    <asp:BulletedList ID="BulletedList2" runat="server" BulletStyle="Numbered">
                        <asp:ListItem Text="father" Value="father"></asp:ListItem>
                        <asp:ListItem Text="mother" Value="mother"></asp:ListItem>
                        <asp:ListItem Text="daughter" Value="daughter"></asp:ListItem>
                    </asp:BulletedList>
                </page:TabPage>
                <page:TabPage ID="TabPage3" Title="工作信息" runat="server">
                    <asp:BulletedList ID="BulletedList3" runat="server" BulletStyle="Numbered">
                        <asp:ListItem Text="NO.3" Value="father"></asp:ListItem>
                        <asp:ListItem Text="NO.2" Value="mother"></asp:ListItem>
                        <asp:ListItem Text="NO.1" Value="daughter"></asp:ListItem>
                    </asp:BulletedList>
                </page:TabPage>
                <page:TabPage ID="TabPage4" Title="google" NavigateUrl="http://www.google.com" NavigateType="Iframe" Height="630" runat="server" >
                </page:TabPage>
                <page:TabPage ID="TabPage5" Title="sohu" NavigateUrl="http://www.sohu.com" NavigateType="Iframe" AllowTargetInBlank="true"
                    Height="630" runat="server">
                </page:TabPage>
            </Tabs>
            <HeaderTemplate>
                <a href="#" onclick="jQuery('#TabControl1').tabDisable(1)">无效</a>| <a href="#" onclick="jQuery('#TabControl1').tabEnable(1);">
                    有效</a>| <a href="#" onclick="jQuery('#TabControl1').tabsAlignToggle();">左/右</a>
            </HeaderTemplate>
        </page:TabControl>
        
        <page:TabControl ID="TabControl2" runat="server" DataSourceID="ObjectDataSource1" TitleText="数据绑定tabs信息" TitleField="title"
            TitleImageUrlField="titleImageUrl" SelectedField="selected" NavigateUrlField="navigateUrl" NavigateTypeField="navigateType"
            AllowTargetInBlankField="allowTargetInBlank" HeightField="height" TabsAlign="Right">
            <HeaderTemplate>
                <a href="#" onclick="jQuery('#TabControl2').tabDisable(1)">无效</a>| <a href="#" onclick="jQuery('#TabControl2').tabEnable(1);">
                    有效</a>| <a href="#" onclick="jQuery('#TabControl2').tabsAlignToggle();">左/右</a>
            </HeaderTemplate>
        </page:TabControl>
        <page:TabControl ID="TabControl3" runat="server" DataSourceID="ObjectDataSource1" TitleText="非数据绑定和数据绑定结合tabs信息" TitleField="title"
            TitleImageUrlField="titleImageUrl" SelectedField="selected" NavigateUrlField="navigateUrl" NavigateTypeField="navigateType"
            AllowTargetInBlankField="allowTargetInBlank" HeightField="height">
            <Tabs>
                <page:TabPage ID="TabPage6" Title="个人信息" TitleImageUrl="../images/user1.gif" runat="server" Selected="true">
                    <asp:BulletedList ID="BulletedList4" runat="server" BulletStyle="Numbered">
                        <asp:ListItem Text="刘国强" Value="father"></asp:ListItem>
                        <asp:ListItem Text="郭丽君" Value="mother"></asp:ListItem>
                        <asp:ListItem Text="刘欣懿" Value="daughter"></asp:ListItem>
                    </asp:BulletedList>
                </page:TabPage>
            </Tabs>
            <HeaderTemplate>
                <a href="#" onclick="jQuery('#TabControl3').tabDisable(1)">无效</a>| <a href="#" onclick="jQuery('#TabControl3').tabEnable(1);">
                    有效</a>| <a href="#" onclick="jQuery('#TabControl3').tabsAlignToggle();">左/右</a>
            </HeaderTemplate>
        </page:TabControl>
    </div>
    </form>
</body>
</html>
